<template>
  <view>
    <base-paging ref="paging" :add-fad="false" :datasource="datasource">
      <template #default="{ list }">
        <template v-for="(item, index) in list" :key="index">
          <base-card>
            <template #title>
              <view style="display: flex" @click.stop="toItemPath(item)">
                <view style="flex: 1; font-weight: bold; font-size: 32rpx; color: #333333; height: 80rpx; line-height: 80rpx;">
                  <uni-badge v-if="item.readed == 'N'" is-dot text=" " />
                  {{ '【' + item.title +  '】' }}
                </view>
                <view style="flex: 1; text-align: right">
                  <view style="font-size: .9em; color: #b7b7b7; line-height: 80rpx;">{{ item.createTime }}</view>
                </view>
              </view>
            </template>
            <view @click.stop="toItemPath(item)" style="font-size: 30rpx; color: #666;">
              {{ item.content }}
            </view>
            <template #actions>
              <view class="fouter" @click.stop="toItemPath(item)">
                <text>查看详情</text>
                <image src="../../static/rightlogin.png" mode="" class="image"></image>
              </view>
            </template>
          </base-card>
        </template>
      </template>
    </base-paging>
  </view>
</template>

<script>
import {Msg, toPath} from "@/utils/BaseUtils";
import {UserNoticeApi as Api} from "@/comms/api/userNoticeApi";

export default {
  data() {
    return {
      toPath,
      // 报修:apply 派修:dispatch 维修:repair 完成:complete"
      tabs: [
        {key: 'apply', name: '报修',},
        {key: 'dispatch', name: '派修'},
        {key: 'repair', name: '维修'},
        {key: 'complete', name: '完成'},
      ]
    }
  },
  mounted() {
  },
  onShow() {
    this.reload()
  },
  methods: {
    reload() {
      this.$refs.paging.reload();
    },
    datasource({pageNo, tab}) {
      return Api.page({pageNo, flag: tab.key})
    },
    remove({id}) {
      Msg.confirm("确定删除该维修申请信息?")
          .then(() => {
            Api.delete({id}).then(res => {
              this.reload();
              Msg.success("删除成功")
            })
          })
    },
    toItemPath(item) {
      Api.read({ id: item.id }).then(res => {
          /**
           * 类型 调度派车:dispatch
           计划单取消:plan_cancel
           计划单人员变更:plan_change_person
           计划单车辆变更:plan_change_vehicle
           调休审核:leave
           车辆维修审核:vehicle_repair
           手工记账审核:bookkeeping
           */
          if (['dispatch','plan_cancel','plan_change_person','plan_change_vehicle'].includes(item.type)) {
            toPath("/pages/tasks/jhdxq/jhdxq?id=" + item.dataId)
          }  else if ( item.type == 'leave') {
            toPath("/pages/mys/level/detail?id=" + item.dataId)
          } else if ( item.type == 'vehicle_repair') {
            toPath("/pages/mys/vehicleRepair/detail?id=" + item.dataId)
          } else if ( item.type == 'bookkeeping') {
            toPath("/pages/mys/bookkeeping/detail?id=" + item.dataId)
          }
        setTimeout(() => this.reload(), 1000)
      })
    }
  }
}
</script>

<style lang="scss" scoped>
:deep(.uni-card) {
  margin-bottom: 10rpx;

  .uni-card__header {
    padding: 30rpx 0rpx 0;
  }

  .uni-card__content {
    padding: 10rpx 10rpx 0 !important;
    margin-bottom: 20rpx;
  }

  .button-group {
    width: 100%;
    border-top: 1rpx solid #F5F7FB;

  }
}


.image {
  width: 40rpx;
  height: 40rpx;
}

.fouter {
  padding: 20rpx 10rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
</style>
